<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>查看员工 - 员工信息管理系统</title>
    <style>
        .container { width: 800px; margin: 50px auto; padding: 20px; box-shadow: 0 0 10px #eee; }
        .info-group { margin: 20px 0; padding: 10px; border-bottom: 1px solid #eee; }
        .label { display: inline-block; width: 150px; font-weight: bold; color: #666; }
        .value { display: inline-block; }
        .btn { padding: 8px 20px; background: #555; color: white; border: none; cursor: pointer; text-decoration: none; }
        .error { color: red; text-align: center; margin-bottom: 20px; }
    </style>
</head>
<body>
<div class="container">
    <h2>员工详情</h2>

    <!-- 错误提示（如员工不存在） -->
    <div class="error" th:if="${error != null}" th:text="${error}"></div>

    <!-- 员工信息展示 -->
    <div th:if="${employee != null}">
        <div class="info-group">
            <span class="label">ID：</span>
            <span class="value" th:text="${employee.id}"></span>
        </div>
        <div class="info-group">
            <span class="label">姓名：</span>
            <span class="value" th:text="${employee.name}"></span>
        </div>
        <div class="info-group">
            <span class="label">部门：</span>
            <span class="value" th:text="${employee.department}"></span>
        </div>
        <div class="info-group">
            <span class="label">职位：</span>
            <span class="value" th:text="${employee.position}"></span>
        </div>
        <div class="info-group">
            <span class="label">薪资：</span>
            <span class="value" th:text="${#numbers.formatDecimal(employee.salary, 1, 2)}">¥0.00</span>
        </div>
        <div class="info-group">
            <span class="label">邮箱：</span>
            <span class="value" th:text="${employee.email}"></span>
        </div>
        <div class="info-group">
            <span class="label">电话：</span>
            <span class="value" th:text="${employee.phone}"></span>
        </div>
        <div class="info-group">
            <span class="label">入职日期：</span>
            <span class="value" th:text="${#dates.format(employee.hireDate, 'yyyy-MM-dd')}"></span>
        </div>

        <!-- 操作按钮 -->
        <div style="margin-top: 30px; text-align: center;">
            <a href="/employee/edit/[[${employee.id}]]" class="btn">编辑</a>
            <a href="/employee" class="btn" style="background: #4CAF50; margin-left: 10px;">返回列表</a>
        </div>
    </div>
</div>
</body>
</html>